<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
	#cssId{
		background-color:#FF0;
		width:300px;
		height:100px;}
	#textId{
		background-color:#CCC;
		width:300px;}
</style>

<script type="text/javascript">
	function change(){
			var selNode = document.getElementById("selId");
			//alert(selNode.nodeName);
			var value = selNode.options[selNode.selectedIndex].value;
			//alert(value);
			var divNode1 = document.getElementById("cssId");
			var divNode2 = document.getElementById("textId");
			divNode1.style.textTransform = value;
			divNode2.innerHTML = "text-transform :"+value+";"
		}
</script>
</head>

<body>
<div id="cssId">
Good good study,Day day up!
</div><p></p>
<select id="selId" onchange="change()">
<option value="none">--请选择--</option>
<option value="capitalize">首字母大写</option>
<option value="uppercase">所有字母大写</option>
<option value="lowercase">所有字母小写</option>
</select>
<p></p>
<div id="textId">
text-transform : none;
</div>
</body>
</html>
